<template>
	<view style="box-sizing: border-box;padding:0 20px;">
		<view class="flex a-t">
			<view @click="select(0)" :class="num==0?'b1':''" class="w50" style="text-align: center;font-size: 14px;">
				我收到的
			</view>
			<view @click="select(1)" :class="num==1?'b1':''"  class="w50" style="text-align: center;font-size: 14px;">
				我送出的
			</view>
		</view>
		<view class="flex a-t">
			<view @click="select1(0)" :class="nums==0?'active':''" class="w50 c999" style="text-align: center;">
				未使用的
			</view>
			<view @click="select1(1)" :class="nums==1?'active':''"  class="w50 c999" style="text-align: center;">
				已使用的
			</view>
		</view>
		<view v-for="(item,index) in list" style="width: 100%;border: #eee solid 1px;padding: 10px;border-radius: 8px;margin-bottom: 10px;" class="flex">
			<view>
				<view class="f12 flex a-t">
					<image src="https://yunkeososyunchuc.bc8t.cn/lianaikongjian/static/hx.png" mode="widthFix" style="width: 20px;"></image>
					爱情兑换券
				</view>
				<view>
					{{item.love_volume_title}}
				</view>
				<view class="f12">
					赠送后生效，对方可行使一次爱的特权
				</view>
			</view>
			<view style="text-align: center;border-left: #eee dashed 1px;box-sizing: border-box;margin-left: 6px;padding-left: 6px;" class="f12">
				有效期
				<view>
					{{item.createtime}}
				</view>
				<button class="botton f12">
					<!-- {{nums==0?'立即使用':''}} 立即赠送 -->

					<view @click="shiyong(item)" v-if="num==0 && nums==0">
						立即使用
					</view>
				</button>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				num:0,
				nums:0,
				list:[],
			}
		},
		onLoad() {
			uni.setNavigationBarColor({
				frontColor: '#000000',
				backgroundColor: '#ffffff'
			});
		},
		onShow() {
			// my=我扭到的，receive_unused=我收到的未使用，receive_used=我收到 的已使用，send_unused=我送出未使用，send_used=我送出已使用
			this.getstatus()
		},

		methods: {
			getstatus(){
				if(this.num==0&&this.nums==0){
					this.my('receive_unused')
				}
				if(this.num==0&&this.nums==1){
					this.my('receive_used')
				}
				if(this.num==1&&this.nums==0){
					this.my('send_unused')
				}
				if(this.num==1&&this.nums==1){
					this.my('send_used')
				}
			},
			async shiyong(e){
				let res = await this.$u.apis.use_volume({volume_id:e.id})
				uni.showToast({
					title:'已使用该特权',
					icon:'none'
				})
                this.getstatus()
            },
			select(e){
				this.num=e
				this.getstatus()
			},
			select1(e){
				this.nums=e
				this.getstatus()
			},
			//券 列表
			async my(status){
				// my=我扭到的，receive_unused=我收到的未使用，receive_used=我收到 的已使用，send_unused=我送出未使用，send_used=我送出已使用
				let data={
					status:status
				}
				this.list = await this.$u.apis.my(data)
			},

			// 我收到的券
			async my_volume(){
				let data={
					volume_id:id
				}
                this.list = await this.$u.apis.my_volume(data)
			},
		}
	}
</script>

<style>
page{
	background: #fff;
}

view, text {
	box-sizing: content-box;
}
.active{
    color:#fa1e8a
}

</style>
